<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
       xmlns:ace="http://www.icefaces.org/icefaces/components">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
<!--        <h:form>
            <h:outputLabel >
                Firstname : 
            </h:outputLabel>
            <h:inputText value="#{register.members.firstNameMembers}"/>
            <br/>
            <br/>
            <h:outputLabel>
                Lastname : 
            </h:outputLabel>
            <h:inputText value="#{register.members.lastNameMembers}"/>              
            <br/>
            <br/>
            <h:outputLabel >
                Email : 
            </h:outputLabel>
            <h:inputText value="#{register.members.emailMembers}"/>
            <br/>
            <br/>
            <h:outputLabel>
                Age : 
            </h:outputLabel>
            <h:inputText value="#{register.members.ageMembers}"/>
            <br/>
            <br/>
            <h:outputLabel>
                Sexe : 
            </h:outputLabel>
            <h:inputText value="#{register.members.genderMembers}"/>
            <br/>
            <br/>
            <h:outputLabel>
                Password : 
            </h:outputLabel>
            <h:inputSecret value="#{register.members.passwordMembers}"/>
            <br/>
            <br/>
            <h:commandButton value="register" action="#{register.registerUser()}" />
                
            
        </h:form>-->
 <h:form id="textEntryForm">
            <ace:panel id="personalInfoInputPanel" header="Personal Info" styleClass="required-styling-demo">
                <h:panelGrid id="inputGrid" columns="1" width="100%" styleClass="textEntryInputTable">
                    <ace:textEntry id="email" value="#{register.members.emailMembers}" label="Email" labelPosition="left" required="false" optionalIndicator="(Opt.)" indicatorPosition="right">
                        <ace:ajax render="@this provinceOutput provinceMsg" event="blur"/>
                       
                    </ace:textEntry>
                    <ace:textEntry id="password" value="#{register.members.passwordMembers}" label="Password" secret="true" labelPosition="left" required="false" optionalIndicator="(Opt.)" indicatorPosition="right">
                        <ace:ajax render="@this provinceOutput provinceMsg" event="blur"/>
                       
                    </ace:textEntry>
                    <ace:textEntry id="firstNameInput" value="#{register.members.firstNameMembers}" label="First Name" labelPosition="left" required="true" requiredIndicator="(*)" indicatorPosition="right">
                        <ace:ajax render="@this firstNameOutput firstNameMsg" event="blur"/>
                    </ace:textEntry>
                    
                    <ace:textEntry id="lastNameInput" value="#{register.members.lastNameMembers}" label="Last Name" labelPosition="left" required="true" requiredIndicator="(*)" indicatorPosition="right">
                        <ace:ajax render="@this lastNameOutput lastNameMsg" event="blur"/>
                    </ace:textEntry>

                    <ace:textEntry id="address1Input" value="#{register.members.usernameMembers}" label="Username" labelPosition="left" required="true" requiredIndicator="(*)" indicatorPosition="right">
                        <ace:ajax render="@this address1Output address1Msg" event="blur"/>
                    </ace:textEntry>

<!--                    <ace:textEntry id="address2Input" value="#{register.members.birthdayMembers}" label="Date de Naissance" labelPosition="left" required="false" optionalIndicator="(Opt.)" indicatorPosition="right">
                        <ace:ajax render="@this address2Output" event="blur"/>
                    </ace:textEntry>-->

                    <ace:textEntry id="cityInput" value="#{register.members.ageMembers}" label="Age" labelPosition="left" required="true" requiredIndicator="(*)" indicatorPosition="right">
                        <ace:ajax render="@this cityOutput cityMsg" event="blur"/>
                    </ace:textEntry>
                    
                    <ace:textEntry id="provinceInput" value="#{register.members.occupationMembers}" label="Job Description" labelPosition="left" required="false" optionalIndicator="(Opt.)" indicatorPosition="right">
                        <ace:ajax render="@this provinceOutput provinceMsg" event="blur"/>
                       
                    </ace:textEntry>
                    <ace:textEntry id="photoprofile" value="#{register.members.photoProfileMembers}" label="Photo Profile" labelPosition="left" required="false" optionalIndicator="(Opt.)" indicatorPosition="right">
                        <ace:ajax render="@this provinceOutput provinceMsg" event="blur"/>
                       
                    </ace:textEntry>

                    <ace:textEntry id="countryInput" value="#{register.members.countryMembers}" label="Country" labelPosition="left" required="true" requiredIndicator="(*)" indicatorPosition="right">
                        <ace:ajax render="@this countryOutput countryMsg" event="blur"/>
                    </ace:textEntry>
                </h:panelGrid>
                <h:panelGrid width="100%">
                    <ace:message id="firstNameMsg" for="firstNameInput"/>
                    <ace:message id="lastNameMsg" for="lastNameInput"/>
                    <ace:message id="address1Msg" for="address1Input"/>
                    <ace:message id="cityMsg" for="cityInput"/>
                    <ace:message id="provinceMsg" for="provinceInput"/>
                    <ace:message id="countryMsg" for="countryInput"/>
                </h:panelGrid>
            </ace:panel>
            
            br/>
            <h:commandButton value="register" action="#{register.registerUser()}" />
        </h:form>
        
    </h:body>
</html>
